/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

var Dialog = function() {};

Dialog.prototype = (function() {
    
    var CLASS = "dialog";
    
    return {
        addHandler: function(handler) {
            this.handler = handler;
        },
        
        setParent: function(selector) {
            this.parent = selector;  
        },
        
        render: function() {
            if(! this.parent){ // Should work for null and undefined
                throw "No parent defined";
            }
            
            var html = this.toHtml();
            // Must render befor attaching listeners (will overwrite)
            $(this.parent).html(html);
            // "this" will be the control inside listener function
            var self = this;
            
            $(this.parent).find("#login").on('click', function() {
                var user = {};
                user.name = $(self.parent).find("#username").val();
                user.password = $(self.parent).find("#password").val();
                if (self.handler) {
                    self.handler(user)
                }
                $(self.parent).html("");  
            })
            
            $(this.parent).find("#cancel").on('click', function(){
                $(self.parent).html("");
            }); 
        },
        
        toHtml: function() {
            var html;
            
            html = "<div class='"+ CLASS + "'>"; 
            
            html += "<table>"  
            + "<tr><td><label for='username'>Username: </label></td><td>"
            + "<input id='username' type='text' size='10' /></td></tr>" 
            + "<tr><td><label for='password'>Password: </label></td><td>" 
            + "<input id='password' type='password' size='10' /></td></tr>"  
            + "</table>"
            + "<input id='login' type='button' value='Login'/>" 
            + "<input id='cancel' type='button' value='Cancel'/>"
            + "</div>";
            return html;
        }
    }
    
})();